<template>
	<div class="box" id="tagRef">
		<div  class="home-page">
			<div class="menu">
				<span>模型选择：</span>
				<select class="selected" v-model="state.currentModel" @click.native="handleChangeCompany">
					<option value="rs">北科瑞声</option>
					<option value="bc">百川智能</option>
					<option value="ms">Moonshot</option>
					<option value="kf">KIMI-FREE</option>
				</select>
				<select class="selected" v-model="state.model">
					<option :value="item" v-for="item in state.modelList">{{item}}</option>
				</select>
			</div>
			<div class="content_box">
				<div  v-for="(item, index) in state.contentList">
					<div class="news_box_left" v-if="item.direction=='left'">
						<div class="box_left_img">
							<img v-if="item.status==1" :src="png1"/><img v-if="item.status==2" :src="png2"/><img v-if="item.status==3" :src="png5"/>
						</div>
						<div class="box_left_content content">
							<p v-html="formattedText(item.content)"></p>
							<div v-if="index !=0">
								<el-button v-if="item.status==3" type="text" @click="ceaseSend"><SvgIcon name="ele-VideoPause" />停止输出</el-button>
								<el-button v-if="item.status==2" type="text" @click="tryAgainSend"><SvgIcon name="ele-Refresh"/>在试一次</el-button>
							</div>
						</div>
						<div class="vacancy_left">
						</div>
					</div>
					<div class="news_box_right" v-if="item.direction=='right'">
						<div class="vacancy_right">
						</div>
						<div class="box_right_content content">
							<p v-html="formattedText(item.content)"></p>
						</div>
						<div class="box_right_img">
							<img :src="png3"/>
						</div>
					</div>
				</div>
			</div>
			<div class="bottom_box">
				<el-input type="textarea"  @keydown.enter.native="enterEvent($event)" v-model="state.txt" placeholder="Enter 发送;Ctrl + Enter 换行" style="margin-left:5px;margin-bottom: 5px;"></el-input>
				<el-upload
					ref="uploadFileRef"
					v-show="false"
					class="upload-resource"
					drag
					:action="state.server"
					:headers = "state.heaerObj"
					:limit="1"
					accept=".docx,.pdf,.png"
					:on-success="handleFileSuccess"
					:on-change="handleChange"
					multiple>
					<i class="el-icon-upload"></i>
				</el-upload>
				<img v-if="state.upIon==true && state.upStatus==true" :src="png8" @click="cancelUpload" style="cursor: pointer;" title="点击取消上传"/>
				<img  v-if="state.upIon==false && state.upStatus==true" :src="png7" @click="handleUpload" style="cursor: pointer;" title="点击上传文件，支持.docx,.pdf,.fpng"/>
				<img v-if="state.currentModel=='bc' && state.network==true" :src="png10" @click="state.network=false"/>
				<img v-if="state.currentModel=='bc' && state.network==false" :src="png9" @click="state.network=true"/>
				<img v-if="state.httpStatus==false" :src="png4" @click="send" style="cursor: pointer;"/>
				<img v-if="state.httpStatus==true" :src="png6"/>
			</div>
			<div class="copyright">
				内容由 AI 大模型生成，请仔细甄别
			</div>
		</div>
		<el-backtop></el-backtop>
	</div>
</template>

<script setup name="home">
import png1 from '/@/assets/1.png';
import png2 from '/@/assets/2.png';
import png3 from '/@/assets/4.png';
import png4 from '/@/assets/send1.png';
import png5 from '/@/assets/5.png';
import png6 from '/@/assets/send2.png';
import png7 from '/@/assets/upload.png';
import png8 from '/@/assets/upload_1.png';
import png9 from '/@/assets/network.png';
import png10 from '/@/assets/network_1.png';
import { ElMessage,ElMessageBox } from 'element-plus';
// import { fa } from 'element-plus/es/locale';
const uploadFileRef = ref();
const state = reactive({
	modelList:['model'],
	bc:['Baichuan2-Turbo','Baichuan2-Turbo-192k'],
	kimi:['moonshot-v1-8k','moonshot-v1-32k','moonshot-v1-128k'],
	kf:['kimi-8k','kimi-32k'],
	rs:['model'],
	currentModel:'rs',
	// model1:['Baichuan2-Turbo','Baichuan2-Turbo-192k'],
	contentList:[
		{'status':2,'direction':'left','content':'你好！我是北科瑞声产业助手,一个由大模型 AI 提供支持的人工智能助手。我擅长进行产业领域问题解答。如果你有任何疑问或需要帮助，请随时告诉我。'}
	], // 初始内容 status判断当前内容状态 direction 输出左边还是右边
	model:'',//选择的模型
	txt:'', // 用户输入的问答内容
	httpStatus:false, // 判断内容是否输出结束
	start:0, // 读取内容的下标
	network:false,// 是否联网搜索
	kikey:[
		'eyJhbGciOiJIUzUxMiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJ1c2VyLWNlbnRlciIsImV4cCI6MTcxOTczNDUxOSwiaWF0IjoxNzExOTU4NTE5LCJqdGkiOiJjbzU2anRxbG5sOTZlanZtcmlpMCIsInR5cCI6InJlZnJlc2giLCJzdWIiOiJjbzU2anRxbG5sOTZlanZtcmlnZyIsInNwYWNlX2lkIjoiY281Nmp0cWxubDk2ZWp2bXJpZzAiLCJhYnN0cmFjdF91c2VyX2lkIjoiY281Nmp0cWxubDk2ZWp2bXJpZmcifQ.M8DhrylzzWCL4KpYGk60TRq5ZpZtdrYHzrVjacDK4y37yD6oDj5JOmq6Zi3E16oUHT1BzIFW4O6BX4wdhcde_Q',
		'eyJhbGciOiJIUzUxMiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJ1c2VyLWNlbnRlciIsImV4cCI6MTcxOTczNDg2NiwiaWF0IjoxNzExOTU4ODY2LCJqdGkiOiJjbzU2bWttY3A3ZjJocDE4NW9qZyIsInR5cCI6InJlZnJlc2giLCJzdWIiOiJjbzU2bWttY3A3ZjJocDE4NW9pZyIsInNwYWNlX2lkIjoiY281Nm1rbWNwN2YyaHAxODVvaGciLCJhYnN0cmFjdF91c2VyX2lkIjoiY281Nm1rbWNwN2YyaHAxODVvaDAifQ.1lNrwICGar4kvEANbqSewL1_4NMkts46bCyIeFpTPNHRjdXLuF1CnQouoI1rmpXTy5sLAlqkzP2rTl-My0xaCQ',
		'eyJhbGciOiJIUzUxMiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJ1c2VyLWNlbnRlciIsImV4cCI6MTcxOTczNDg2NSwiaWF0IjoxNzExOTU4ODY1LCJqdGkiOiJjbzU2bWthbG5sOTZlanZzMGk4MCIsInR5cCI6InJlZnJlc2giLCJzdWIiOiJjbzU2bWthbG5sOTZlanZzMGk2ZyIsInNwYWNlX2lkIjoiY281Nm1rYWxubDk2ZWp2czBpNjAiLCJhYnN0cmFjdF91c2VyX2lkIjoiY281Nm1rYWxubDk2ZWp2czBpNWcifQ.yze3aIll8lVGqk1eYgNhjPEQF1r6Hjae926i5OmlZtxAeRXj_Qi4Vrz0DuWdMer4MiJiIIP0NkoyLi99stmNpw',
		'eyJhbGciOiJIUzUxMiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJ1c2VyLWNlbnRlciIsImV4cCI6MTcxOTczNDg1MiwiaWF0IjoxNzExOTU4ODUyLCJqdGkiOiJjbzU2bWgybG5sOTZlanZycHRmZyIsInR5cCI6InJlZnJlc2giLCJzdWIiOiJjbzU2bWgybG5sOTZlanZycHRlZyIsInNwYWNlX2lkIjoiY281Nm1oMmxubDk2ZWp2cnB0ZGciLCJhYnN0cmFjdF91c2VyX2lkIjoiY281Nm1oMmxubDk2ZWp2cnB0ZDAifQ.7E7nomfeBBAKWEF7cKcwFObdvuaaETWKPS1PniL_3zPIX1NiDMf-vRznIc33LxAzt4MidzJBUQPcKLkD9lTrKA',
		'eyJhbGciOiJIUzUxMiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJ1c2VyLWNlbnRlciIsImV4cCI6MTcxOTczNDg0MywiaWF0IjoxNzExOTU4ODQzLCJqdGkiOiJjbzU2bWVxbG5sOTZlanZybG44MCIsInR5cCI6InJlZnJlc2giLCJzdWIiOiJjbzU2bWVxbG5sOTZlanZybG42ZyIsInNwYWNlX2lkIjoiY281Nm1lcWxubDk2ZWp2cmxuNWciLCJhYnN0cmFjdF91c2VyX2lkIjoiY281Nm1lcWxubDk2ZWp2cmxuNTAifQ.11yzgr3no5bPgvw7g-mzt8swJ6OMq7qBtXdcxSO9UOIA4Oi0DTSlEI8Ghfe0EXQZVR_YLhqii2qdwpkr-aqefw',
		'eyJhbGciOiJIUzUxMiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJ1c2VyLWNlbnRlciIsImV4cCI6MTcxOTczNDUxOSwiaWF0IjoxNzExOTU4NTE5LCJqdGkiOiJjbzU2anRxbG5sOTZlanZtcmJlMCIsInR5cCI6InJlZnJlc2giLCJzdWIiOiJjbzU2anRxbG5sOTZlanZtcmJjZyIsInNwYWNlX2lkIjoiY281Nmp0cWxubDk2ZWp2bXJiYzAiLCJhYnN0cmFjdF91c2VyX2lkIjoiY281Nmp0cWxubDk2ZWp2bXJiYmcifQ.QlGWT2WlB1Q1Z3nNJ-2gd4EBY5KSvLjfs4hqdBbBNjavsOdL9tYfnDkofxyiilqK5BZA_PBboXEC01iT5uQBzw',
	],
	heaerObj:{Authorization:'Bearer sk-RR9fGn86n9sdqMf7dwTB2eseGzsWrs1kKXEajbGWSfxlMQoj'},
	server:'https://api.moonshot.cn/v1/files', // 文件上传的服务地址
	fileId:'', //上传的文件ID
	fileContent:'',//识别的文件内容
	upIon:false, // 显示当前的图标
	upStatus:false,// 显示当前是否可上传文件
	xhr:null, // 请求对象
	labelJudgment:true, // 判断标签是否有替换
	
});	
state.model = state.modelList[0]

// 选择模型
const handleChangeCompany = (event) => {
	console.log(event.target.value)
	if(event.target.value == 'bc'){
		state.modelList = state.bc
		state.upStatus =false;
	}
	if(event.target.value == 'ms'){
		state.modelList = state.kimi
		state.upStatus =true;
	}
	if(event.target.value == 'kf'){
		state.modelList = state.kf
		state.upStatus =false;
	}
	if(event.target.value == 'rs'){
		state.modelList = state.rs
		state.upStatus =false;
	}
	state.model = state.modelList[0]
}

// 内容到最底部
const boxToBottom = () => {
  nextTick(() => {
    let element = document.getElementById("tagRef");
    element.scrollTop = element.scrollHeight;
  });
};

// 按键监听
const enterEvent= (event) => {
      if(!event.ctrlKey){
        event.preventDefault();
        send();
      }else{
        state.txt += '\n';
      }
}

// 发送
const send= () => {
	if(state.txt==""){
		ElMessage.error('请输入内容！')
		return false;
	}
	if(state.model==""){
		ElMessage.error('请选择模型！')
		return false;
	}
	if(state.currentModel == 'bc'){
		bcSend();
	}
	if(state.currentModel == 'ms'){
		if(state.fileId !=""){
			fileContentExtraction()
		}else{
			msSend();
		}
	}
	if(state.currentModel == 'kf'){
		kfSend();
	}
	if(state.currentModel == 'rs'){
		rsSend();
	}
}

/**
 * 在试一次
 */
const tryAgainSend = () => {
	state.txt = state.contentList[state.contentList.length-2].content
	send();
}
/**
 * 停止发送
 */
const ceaseSend = () => { 
	state.xhr.abort();
}

// raisound
const rsSend= () => {
		state.xhr = new XMLHttpRequest();
		var url = "http://218.17.23.157:8009/main";
		state.xhr.open("POST", url, true);
		state.xhr.setRequestHeader("Content-Type", "application/json");

		// 请求前处理
		requestProcessing();
        state.xhr.onreadystatechange = function () {
			if(state.xhr.status == 200){
				if(state.xhr.readyState == 2){
					state.txt = '';
				}else if(state.xhr.readyState == 3){
					console.log(state.xhr.response)
					let chunkText = state.xhr.response;
					chunkText = chunkText.match(/data:.+./g) || [];
					let str = '';
					for (let i=0;i<chunkText.length;i++){
						let res  = chunkText[i].substring(5, chunkText[i].length);
						var obj = JSON.parse(res);//对象
						str += textProcessing(obj.stream_result)
					}
					state.contentList[state.contentList.length-1].content = overallContent(str);
					boxToBottom()
				} else if(state.xhr.readyState == 4){
					state.contentList[state.contentList.length-1].status = 2	
					state.httpStatus =false;
				}
			}else{
				// 请求异常处理
				requestException();
			}
        };
        var data = JSON.stringify({
          "query": state.txt
		});
        state.xhr.send(data);
}

// Moonshot
const msSend= () => {
		state.xhr = new XMLHttpRequest();
		var url = "https://api.moonshot.cn/v1/chat/completions";
		state.xhr.open("POST", url, true);
        // xhr.setRequestHeader("Content-Type", "application/json");
        // xhr.setRequestHeader("Content-Type", "application/json");
        state.xhr.setRequestHeader("Authorization", "Bearer sk-RR9fGn86n9sdqMf7dwTB2eseGzsWrs1kKXEajbGWSfxlMQoj");

		// 请求前处理
		requestProcessing();
        state.xhr.onreadystatechange = function () {
			if(state.xhr.status == 200){
				if(state.xhr.readyState == 2){
					state.txt = '';
				}else if(state.xhr.readyState == 3){
					let chunkText = state.xhr.response;
					var lines = chunkText.split('\n');
					var str = '';  
					for (var i = 0; i < lines.length; i++) {  
						var line = lines[i];  
						if (line) {  
							console.log(line)
							// 这里只是简单地打印事件数据，你可能需要更复杂的解析逻辑  
							var txt = line.split('choices')
							if(txt[1] !=undefined){
								var parts = txt[1].split('['); // 使用中括号 [ 分割字符串
								var result = parts[1].split(']')[0];
								var jsonObject = JSON.parse(result);
								if(jsonObject.delta.content !=undefined){
									str+=textProcessing(jsonObject.delta.content)
								}
							}
						}  
					}
					state.contentList[state.contentList.length-1].content = overallContent(str);
					boxToBottom()
				} else if(state.xhr.readyState == 4){
					state.contentList[state.contentList.length-1].status = 2	
					state.httpStatus =false;
				}
			}else{
				// 请求异常处理
				requestException();
			}
        };
        var data = JSON.stringify({
          "model": state.model,
          "messages":[
			{
				"role": "system",
				"content": "你好！我是北科瑞声产业助手,一个由大模型 AI 提供支持的人工智能助手。我擅长进行产业领域问题解答。如果你有任何疑问或需要帮助，请随时告诉我。"
			},
			{"role":"user","content":state.txt}
		],
          "temperature": 0.3,
          "stream": true
        });
        state.xhr.send(data);
}

// KIMI-FREE
const kfSend= () => {
		state.xhr = new XMLHttpRequest();
		var url = "http://175.178.128.124:8000/v1/chat/completions";
		state.xhr.open("POST", url, true);
        // xhr.setRequestHeader("Content-Type", "application/json");
        state.xhr.setRequestHeader("Content-Type", "application/json");
		let keyInfo = state.kikey[Math.round(Math.random()*5)];
        state.xhr.setRequestHeader("Authorization", "Bearer "+keyInfo);

		// 请求前处理
		requestProcessing();
        state.xhr.onreadystatechange = function () {
			if(state.xhr.status == 200){
				if(state.xhr.readyState == 2){
					state.txt = '';
				}else if(state.xhr.readyState == 3){
					console.log(state.xhr.response)
					let chunkText = state.xhr.response;
					var lines = chunkText.split('\n');
					var str = '';  
					for (var i = 0; i < lines.length; i++) {  
						var line = lines[i];  
						if (line) {  
							// 这里只是简单地打印事件数据，你可能需要更复杂的解析逻辑  
							var txt = line.split('choices')
							if(txt.length==1){
								var jsonObject = JSON.parse(txt[0]);
								if(jsonObject.code ==-2001){
									ElMessage.error('请稍后再试。 请联系管理员！-2001')
									state.contentList[state.contentList.length-1].content = '服务器开小差,请刷新页面后重试 '
									state.contentList[state.contentList.length-1].status = 2
									state.xhr.abort()
								}
							}
							if(txt[1] !=undefined){
								var parts = txt[1].split('['); // 使用中括号 [ 分割字符串
								var result = parts[1].split(']')[0];
								var jsonObject = JSON.parse(result);
								if(jsonObject.delta.content !=undefined){
									console.log(jsonObject.delta.content)
									str+=textProcessing(jsonObject.delta.content)
								}
							}
						}  
					}
					if(str !=""){
						state.contentList[state.contentList.length-1].content = overallContent(str);
						boxToBottom()
					}
				} else if(state.xhr.readyState == 4){
					state.contentList[state.contentList.length-1].status = 2	
					state.httpStatus =false;
				}
			}else{
				// 请求异常处理
				requestException();
			}
        };
        var data = JSON.stringify({
          "model": state.model,
          "messages":[
			{
				"role": "system",
				"content": "你好！我是北科瑞声产业助手,一个由大模型 AI 提供支持的人工智能助手。我擅长进行产业领域问题解答。如果你有任何疑问或需要帮助，请随时告诉我。"
			},
			{"role":"user","content":state.txt}
		],
          "temperature": 0.3,
          "stream": true
        });
        state.xhr.send(data);
}


// 百川模型
const bcSend= () => {
		state.xhr = new XMLHttpRequest();
		var url = "https://api.baichuan-ai.com/v1/chat/completions";
		state.xhr.open("POST", url, true);
        state.xhr.setRequestHeader("Content-Type", "application/json");
        // xhr.setRequestHeader("Content-Type", "application/json");
        state.xhr.setRequestHeader("Authorization", "Bearer sk-711475cb607c5a6b1735a4d23b3e9a3d");
		// 请求前处理
		requestProcessing();
		state.start = 0;
        state.xhr.onreadystatechange = function () {
			if(state.xhr.status == 200){
				if(state.xhr.readyState == 2){
					state.txt = '';
					state.contentList[state.contentList.length-1].content = '';
				}else if(state.xhr.readyState == 3){
					let chunkText = state.xhr.response;
					var lines = chunkText.split('\n');
					var str = '';  
					for (var i = state.start; i < lines.length; i++) {  
						var line = lines[i];  
						if (line) {  
							// 这里只是简单地打印事件数据，你可能需要更复杂的解析逻辑  
							var txt = line.split('choices')
							if(txt[1] !=undefined){
								var parts = txt[1].split('['); // 使用中括号 [ 分割字符串
								var result = parts[1].split(']')[0];
								var jsonObject = JSON.parse(result);
								str+=textProcessing(jsonObject.delta.content)
							}
						}  
					}
					state.start = lines.length-1
					state.contentList[state.contentList.length-1].content = state.contentList[state.contentList.length-1].content+str;
					boxToBottom()
				} else if(state.xhr.readyState == 4){
					state.contentList[state.contentList.length-1].status = 2	
					state.httpStatus =false;
				}
			}else{
				// 请求异常处理
				requestException();
			}
        };
        var data = JSON.stringify({
          "model": state.model,
          "messages":[{"role":"user","content":state.txt}],
          "temperature": 0.3,
          "stream": true,
		  "with_search_enhance":state.network,
        });
        state.xhr.send(data);
}

// Moonshot获取文件内容
const getContent= () => {
		if(state.fileId ==""){
			return false;
		}
		state.xhr = new XMLHttpRequest();
		var url = "https://api.moonshot.cn/v1/files/"+state.fileId+"/content";
        state.xhr.open("GET", url, false);
        state.xhr.setRequestHeader("Authorization", "Bearer sk-RR9fGn86n9sdqMf7dwTB2eseGzsWrs1kKXEajbGWSfxlMQoj");
        state.xhr.onreadystatechange = function () {
          if (state.xhr.readyState === 4 && state.xhr.status === 200) {
            var json = JSON.parse(state.xhr.responseText);
			state.fileContent = json.content
          } else {
            console.warn('文件内容获取错误！') 
			ElMessage.error('文件内容获取错误！')
          }
        };
        state.xhr.send(null);
}

// Moonshot文件内容抽取
const fileContentExtraction= () => {
		state.xhr = new XMLHttpRequest();
		var url = "https://api.moonshot.cn/v1/chat/completions";
        state.xhr.open("POST", url, true);
        state.xhr.setRequestHeader("Authorization", "Bearer sk-RR9fGn86n9sdqMf7dwTB2eseGzsWrs1kKXEajbGWSfxlMQoj");
		// 请求前处理
		requestProcessing();
        state.xhr.onreadystatechange = function () {
			if(state.xhr.status == 200){
				if(state.xhr.readyState == 2){
					state.txt = '';
				}else if(state.xhr.readyState == 3){
					let chunkText = state.xhr.response;
					var lines = chunkText.split('\n');
					var str = '';  
					for (var i = 0; i < lines.length; i++) {  
						var line = lines[i];  
						if (line) {  
							console.log(line)
							// 这里只是简单地打印事件数据，你可能需要更复杂的解析逻辑  
							var txt = line.split('choices')
							if(txt[1] !=undefined){
								var parts = txt[1].split('['); // 使用中括号 [ 分割字符串
								var result = parts[1].split(']')[0];
								var jsonObject = JSON.parse(result);
								if(jsonObject.delta.content !=undefined){
									str+=textProcessing(jsonObject.delta.content)
								}
							}
						}  
					}
					state.contentList[state.contentList.length-1].content = overallContent(str);
					boxToBottom()
				} else if(state.xhr.readyState == 4){
					state.contentList[state.contentList.length-1].status = 2	
					state.httpStatus =false;
				}
			}else{
				// 请求异常处理
				requestException();
			}
        };
		var data = JSON.stringify({
          "model": state.model,
          "messages":[
			{
				"role": "system",
				"content": "你好！我是北科瑞声产业助手,一个由大模型 AI 提供支持的人工智能助手。我擅长进行产业领域问题解答。如果你有任何疑问或需要帮助，请随时告诉我。"
			},
			{
				"role": "system",
				"content": state.fileContent,
			},
			{"role":"user","content":state.txt}
		],
          "temperature": 0.3,
          "stream": true
        });
		state.xhr.send(data);
}

/**
 * 格式处理
 * @param {*} rawText 
 */
const formattedText =(rawText)=> {
      return rawText.replace(/\n/g, '<br>');
}

/**
 * 请求前将一下状态设置为初始化
 */
const requestProcessing =()=> {
	state.labelJudgment = true
	state.contentList[state.contentList.length-1].status = 1
	let txt ='正在查询....请稍等!';
	let rightContent = {'status':1,'direction':'right','content':state.txt};
	let leftContent = {'status':3,'direction':'left','content':txt};
	state.contentList.push(rightContent);
	state.contentList.push(leftContent);
	state.httpStatus = true
	boxToBottom() // 页面滚动
}

/**
 * 处理接收文本
 * @param {*} result 
 */
const textProcessing  = (result) => {
	let txt = result.replace(/^\s+|\s+$/g, '');
	if(txt =='**'){
		if(state.labelJudgment){
			txt = '<b>';
			state.labelJudgment = false	
			console.log(1)
		}else{
			txt = '</b>';
			console.log(2)
			state.labelJudgment = true
		}
		return txt; 
	}else{
		return result;
	}
}

// 
/**
 * 内容整体检索替换【内容可能是一个一个字返回，需要整体检索】
 * @param {*} txt 
 */
const overallContent = (txt) => {
		if(txt !=""){
			var txt = txt.replace("KIMI", "小福")
			var txt = txt.replace("Kimi", "小福")
			var txt = txt.replace("Moonshot", "北科瑞声")
			var txt = txt.replace("月之暗面", "北科瑞声")
			var txt = txt.replace("百川", "北科")
			var txt = txt.replace("百川智能", "北科瑞声")
		}
      return txt;
}

// 请求异常
const requestException= () => {
	if(state.xhr.status == 0){
		let chunkText = state.xhr.response;
		var lines = chunkText.split('\n');
		ElMessage.success('停止输出 '+lines[0])
		state.contentList[state.contentList.length-1].status = 2
		// xhr.abort()
		state.httpStatus =false;
	}else{
		let chunkText = state.xhr.response;
		var lines = chunkText.split('\n');
		ElMessage.error('服务器开小差 '+lines[0])
		state.contentList[state.contentList.length-1].content = '服务器开小差,请刷新页面后重试 '
		state.contentList[state.contentList.length-1].status = 2
		// xhr.abort()
		state.httpStatus =false;
	}
}

// 选择文件
const handleChange= (file, fileList) => {
  if (fileList.length < 0) {
    ElMessage.error('未选择文件');
    state.selectFile = false;
    return false;
  }else{
    state.selectFile = true;
  }
}

/** 文件上传成功处理 */
const handleFileSuccess = (response, file, fileList) => {
   		state.fileId = response.id
		if(state.fileId){
			state.upIon = true,
			uploadFileRef.value.clearFiles()
			getContent();
			ElMessage.success('文件上传成功!');
		}else{
			ElMessage.error('文件上传失败!');
			return false;
		}
};

// 取消已上传的文件
const cancelUpload= () => {
	state.upIon = false,
	state.fileId = '';
	state.fileContent = '';
}

// 文件上传弹窗
const handleUpload = () =>{
	document.querySelector(".upload-resource .el-upload").click()
}

// 页面加载时
onMounted(() => {
	
});

</script>

<style scoped lang="scss">
	.box{
		// width: 50%;
		height: 100vh;
		overflow-y:scroll;
	}
	.home-page{
		width: 40%;
		margin: auto;
	}
	.news_box_left{
		width: 100%;
		display: flex;
	}
	.box_left_img{
		width: 55px;
	}
	.box_left_img img{
		width: 55px;
	}
	.box_left_content{
		flex: 1;
		background-color: #ffffff;
	}
	.vacancy_left{
		width: 50px;
	}
	.vacancy_right{
		width: 80px;	
	}
	.news_box_right{
		width: 100%;
		display: flex;
		justify-content: flex-end;
	}
	.box_right_content{
		// flex: 1;
		margin-right: 10px;
		line-height: 30px;
		background-color: #2d65f7;
		color: #ffffff;
	}
	.box_right_img{
		width: 35px;;
	}
	.box_right_img img{
		width: 35px;
	}
	.content{
		overflow: hidden;
		padding: 11px;
		border-radius: 12px;
		min-height: 50px;
		margin-bottom: 25px;
		flex-flow: column;
	}
	.bottom_box{
		position: fixed;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 1010;
		height: 65px;
		background: #fff;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 45%;
		margin: auto;
		margin-bottom: 40px;
		border-radius: 12px;
		
	}
	.bottom_box img{
		width: 24px;
		height: 24px;
		margin: 20px 20px 20px 0px;
	}
	:deep(.el-textarea__inner) {
		box-shadow: 0 0 0 0px;
		resize: none;
	}
	:deep(.el-textarea__inner:hover) {
		box-shadow: 0 0 0 0px;
		resize: none;
	}
	:deep(.el-textarea__inner:focus) {
		box-shadow: 0 0 0 0px;
		resize: none;
	}
	.copyright{
			position: fixed;
			right: 0;
			bottom: 0;
			left: 0;
			z-index: 1010;
			height: 40px;
			background: #F3F5FC;
			// border-top: 1px solid #F3F5FC;

			display: flex;
		    justify-content: center;
		    align-items: center;
			border-radius: 12px;
	}
	.menu{
			position: fixed;
			right: 0;
			top: 0;
			left: 0;
			z-index: 1010;
			height: 60px;
			background: #F3F5FC;
			// border-top: 1px solid #F3F5FC;

			display: flex;
		    justify-content: center;
		    align-items: center;
			border-radius: 12px;
			padding-top: 20px;
	}
	.selected{
			border: none; //清除select聚焦时候的边框颜色
            height: 40px;
            line-height: 40px; //隐藏select的下拉图标
			background: #F3F5FC;
			margin-right: 30px;
			line-height: 50px;
	}
	.content_box{
		margin-top: 70px;
		margin-bottom: 120px;
	}
	select option {
		font-size: 16px;
		font-family: Arial, sans-serif;
		font-weight: normal;
		color: #333;
	}
</style>
